<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                template="/templates/mainLayout.xhtml">
    <ui:define name="title">sOffice-Sửa thông tin role</ui:define>
    <ui:define name="idleMonitor">
        <h:form id="monitorForm" prependId="false">
            <p:idleMonitor timeout="#{roleBean.conversation.getTimeout()}" onidle="idleDialog.show();" 
                           onactive='window.location = "list.jsf";' rendered="#{!roleBean.conversation.isTransient()}"/>

            <p:dialog header="Info" resizable="false" widgetVar="idleDialog" modal="true" width="400">
                <h:outputText value="The session for this page is timeout" />
            </p:dialog>
        </h:form>
    </ui:define>
    <ui:define name="content">
        <f:event type="preRenderView" listener="#{roleBean.preEditAction()}" />
        <!-- Tab Menu -->
        <ui:include src="/templates/tabmenu.xhtml">
            <ui:param name="tabIndex" value="5"/>
        </ui:include>

        <p:outputPanel>
            <p:layout style="height: 100%;">
                <p:layoutUnit position="west" resizable="true" minSize="210">  
                    <ui:include src="/admin/leftmenu.xhtml"/>
                </p:layoutUnit>

                <p:layoutUnit position="center">
                    <h:form id="mainForm">
                        <p:panel header="Sửa thông tin role">
                            <p:messages id="msgs"/>
                            <p:toolbar style="margin-bottom: 10px; margin-top: 10px;" rendered="#{roleBean.role != null}">
                                <p:toolbarGroup align="left">  
                                    <p:commandButton value="Cập nhật" action="#{roleBean.updateAction()}" update="mainForm"/>
                                    <p:commandButton value="Huỷ" action="#{roleBean.cancelAction()}" immediate="true"/>
                                    <p:commandButton type="reset" value="Nhập lại"/>
                                </p:toolbarGroup>
                            </p:toolbar>

                            <h:panelGrid styleClass="panelGrid" columnClasses="ui-state-default labelCol, ui-widget-content" 
                                         columns="2" cellpadding="5" width="100%" rendered="#{roleBean.role != null}">  
                                <h:outputLabel for="name" style="display: inline; float: right; padding-right: 5px;" value="Name *" />  
                                <p:inputText value="#{roleBean.role.name}" id="name" required="true" label="Name" maxlength="25"
                                             requiredMessage="The Name value is required"/>

                                <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Code" />
                                <p:selectOneMenu value="#{roleBean.role.code}" effect="fade">  
                                    <f:selectItems value="#{RoleCode.ALL_ROLE_VALUES}" var="role" itemLabel="#{role.toString()}" itemValue="#{role}"/>  
                                </p:selectOneMenu>

                                <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Description " />
                                <p:inputTextarea style="width:50%; height:100px;" value="#{roleBean.role.description}" maxlength="200"/>
                            </h:panelGrid>

                            <p:toolbar style="margin-bottom: 10px; margin-top: 10px;" rendered="#{roleBean.role != null}">
                                <p:toolbarGroup align="left">  
                                    <p:commandButton value="Cập nhật" action="#{roleBean.updateAction()}" update="mainForm"/>
                                    <p:commandButton value="Huỷ" action="#{roleBean.cancelAction()}" immediate="true"/>
                                    <p:commandButton type="reset" value="Nhập lại"/>
                                </p:toolbarGroup>
                            </p:toolbar>
                        </p:panel>
                    </h:form>
                </p:layoutUnit>
            </p:layout>
        </p:outputPanel>
    </ui:define>
</ui:composition>